<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>layout 后台大布局 - Layui</title>
    <link rel="stylesheet" href="../static/layui/css/layui.css">
    <link rel="stylesheet" href="../static/style/style.min.css">

</head>
<body class="layui-layout-body">

<div class="layui-form" lay-filter="layuiadmin-form-cate" id="layuiadmin-form-cate" style="padding: 20px 30px 0 0;">
    <input type="hidden" id="authority" value="<$ roleAuthority $>">
    <input type="hidden" id="selectedId">
    <div id="jstree">
    </div>
</div>
<script src="../static/js/jquery.min.js"></script>
<script src="../static/plugs/jstree.min.js"></script>
<script src="../static/layui/layui.js"></script>
<script>

    layui.use(['element'], function () {

        var element = layui.element;
    });
    $(function () {
        $('#jstree').on("changed.jstree", function (e, data) {
            $('#selectedId').val(JSON.stringify(data.selected));
        });
        $('button').on('click', function () {
            $('#jstree').jstree(true).select_node('child_node_1');
            $('#jstree').jstree('select_node', 'child_node_1');
            $.jstree.reference('#jstree').select_node('child_node_1');
        });

        var tree = $("#jstree").jstree({
            "core": {
                "check_callback": true,
                'data': {
                    'url': '/userRole/getRoleMenu',
                    'data': function () {
                        let authority = $('#authority').val();
                        return {'authority': authority};
                    }
                }
            },
            "checkbox": {
                "keep_selected_style": false
            },
            "plugins": ["wholerow", "checkbox"]
        });

        $('#jstree').on('ready.jstree', function () {           //树加载完毕之后赋值
            let roleId = $('#jstree').jstree(true).get_selected();
            $('#selectedId').val(JSON.stringify(roleId));
        })
    });

</script>
</body>
</html>
